<template>
    <!-- vue2模板 -->
      <div class="slot-demo">
          <h3>{{title}}</h3>
          <SlotDemo>
            <div slot>
                匿名插槽
            </div>
            <div slot="n1">
                具名插槽
            </div>
            <ul slot-scope="scope">
            <div>{{scope}}</div>
                <div>
                    <li v-for="(v,i) in scope.arr" :key="i">
                        {{v}}
                    </li>
                </div>
            </ul>
          </SlotDemo>

      </div>
  </template>
  
  <script>
  import SlotDemo from '@/components/SlotDemo.vue'

  export default {
      name: 'Test',
      components:{SlotDemo},
      data() {
          return {
            title:""
          };
      },
      props:{
  
      },
      mounted() {
       
      },
  
      methods: {
  
      },
  };
  </script>
  
  <style scoped>
    .slot-demo{
        
    }

    .slot-demo ul li{
        color: red;
    }
  </style>
  